<template>
	<view style="padding-bottom: 100rpx;">
		<u-swiper :list="list1" height="260" circular :autoplay="false" radius="0"></u-swiper>
		<view class="huang_text margin_top flexcenter titletext" v-if="zs_type!=1 && zs_type!=2">
			{{start_date}}入住{{end_date}}離開，共{{rznum}}晚</view>
		<view class="huang_text margin_top flexcenter titletext" v-if="zs_type==2">
			{{start_date}}入住{{returnxxjsTime(end_date,dataAll.xxtime)}}離開</view>
		<view class="mainpadding">
			<view class="mainpadding ffffff radius">
				<view class="hei_text bold" style="font-size: 36rpx;">{{dataAll.num}}</view>
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="itemtime">享受{{dataAll.sharezk}}折</view>
						<text class="xiaohuang margin_left1" style="font-size: 28rpx;">剩餘:{{dataAll.house_num}}</text>
					</view>
				</view>
				<view class="margin_top flexbetween">
					<text class="bigtext bold xiaohong">單價:${{dataAll.pricedata.price}}元</text>
					<u-number-box button-size="36" color="#000000" :min="1" :max="Number(dataAll.house_num)" bgColor="#F7F7F7"
						iconStyle="color: #fff" v-model="house_num"></u-number-box>
				</view>
			</view>
			<view class=" ffffff margin_top radius" v-for="(item,index) in gg_content_text" :key="index">
				<view class="flexbetween " style="background-color: #f8b62a;padding: 10rpx 30rpx;">
					<view class="titletext hei_text bold">{{item.name}}</view>
					<view class="xiaohei main_size bold" v-if="item.num!=0">{{item.fh==1?'必須':'至少'}}選擇{{item.num}}個
					</view>
				</view>
				<view class="mainpadding">
					<view class="flexleft margin_top" :class="i==item.content.length-1?'':'pdl'"
						v-for="(value,i) in item.content" :key="i">
						<view class="listleftimg2 radius margin_right">
							<image class="listleftimg2 radius" :src="value.image_arr[0]" mode=""></image>
						</view>
						<view class="flexbetween flex1">
							<view style="width: 60%;">
								<view class="hei_text main_size bold yihang">{{value.name}}</view>
								<view class="huang_text main_size bold margin_top">
									<text
										class="text_h color_red margin_right1">${{Number(value.money).toFixed(0)}}</text>
								</view>
							</view>
							<u-number-box button-size="36" color="#000000" :min="0" bgColor="#F7F7F7"
								iconStyle="color: #fff" v-model="value.num"></u-number-box>
						</view>
					</view>
				</view>

			</view>
			<view class="mainpadding_top ffffff radius">
				<view class="flexbetween">
					<view class="xiaohei main_size">區域</view>
					<view class="xiaohei main_size">{{dataAll.shoparea.name}}</view>
				</view>
				<view class="flexbetween margin_top">
					<view class="xiaohei main_size">使用人數</view>
					<view class="xiaohei main_size">{{dataAll.count}}人</view>
				</view>
				<view class="flexbetween margin_top" v-if="zs_type==2">
					<view class="xiaohei main_size">休息时间</view>
					<view class="xiaohei main_size">{{dataAll.xxtime}}小時</view>
				</view>
				<view class="flexbetween margin_top" v-if="zs_type!=2">
					<view class="xiaohei main_size">結束時間</view>
					<view class="xiaohei main_size">{{end_date}}</view>
				</view>
				<view class="flexbetween margin_top" v-if="zs_type==2">
					<view class="xiaohei main_size">結束時間</view>
					<view class="xiaohei main_size">{{returnxxjsTime(end_date,dataAll.xxtime)}}</view>
				</view>
				<view class="xiaohei titletext margin_top bold">設施與服務</view>
				<view class="xiaohei margin_top2 main_size"><text v-for="(it,ind) in dataAll.fwss_text" :key="it">
						<text class="margin_right1">{{it}}</text>
						<text class="margin_right1" v-if="dataAll.fwss_text.length-1!=ind"> | </text>
					</text></view>
				<view class="xiaohei titletext margin_top bold">購買須知</view>
				<view class="margin_top xiaohei main_size">
					<text>{{dataAll.buy_notice}}</text>
				</view>
				<view class="xiaohei titletext margin_top bold">資訊介紹</view>
				<view class="margin_top xiaohei main_size bold" style="color: #346c5f;">
					<text>{{dataAll.des}}</text>
				</view>
			</view>
		</view>
		<view class="posibottom ffffff flexbetween mainpadding">
			<view class="huang_text bold" style="font-size: 40rpx;">合計:${{allmoney()}}</view>
			<view class="buybtn" @click="submit()">加入購物車</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				listid: "",
				dataAll: {},
				list: [],
				rznum: 0,
				start_date: "",
				end_date: "",
				zs_type: 1,
				allnum: 0,
				yhlxid: "",
				gg_content_text: [],
				is_yc: 0,
				list1: [],
				adult_num: "",
				old_num: "",
				child_num: "",
				shop_id: uni.getStorageSync("shop_id"), //店鋪id
				house_num:1,
			}
		},
		onLoad(options) {
			let data = JSON.parse(decodeURIComponent(options.msg));
			this.rznum = data.rznum
			this.start_date = data.start_date
			this.end_date = data.end_date
			this.listid = data.id
			this.zs_type = data.zs_type
			this.allnum = data.allnum
			this.yhlxid = data.yhlxid
			this.is_yc = data.is_yc
			this.adult_num = data.adult_num
			this.old_num = data.old_num
			this.child_num = data.child_num
			this.getdetail()
		},
		methods: {
			allmoney() { //總價
				let price = 0
				let gg_price = 0
				this.gg_content_text.forEach(item => {
					item.content.forEach(value => {
						if (value.num) {
							if (this.zs_type != 1 && this.zs_type != 2) {
								price = Number(price) + Number(value.money) * value.num * this.rznum
							} else {
								price = Number(price) + Number(value.money) * value.num
							}

						}
					})
				})
				price = (Number(this.dataAll.pricedata.price) + price) * this.house_num
				return price
			},
			allggmoney() { //规格總價
				let gg_price = 0
				this.gg_content_text.forEach(item => {
					item.content.forEach(value => {
						if (value.num) {
							if (this.zs_type != 1 && this.zs_type != 2) {
								gg_price = gg_price + Number(value.money) * value.num * this.rznum
							} else {
								gg_price = gg_price + Number(value.money) * value.num
							}
						}
					})
				})
				return gg_price * this.house_num
			},
			getdetail() {
				httpRequest.request('/api/hotel/hotelDetail', 'GET', {
					id: this.listid,
					zs_type: this.zs_type,
					yhlxid: this.yhlxid,
					start_date: this.start_date,
					end_date: this.end_date,
					allnum: this.allnum,
					is_yc: this.is_yc,
					adult_num: this.adult_num,
					old_num: this.old_num,
					child_num: this.child_num,
				}).then(res => {
					let list1 = res.data.images_text
					list1.unshift(res.data.video_url_text)
					this.list1 = list1
					this.dataAll = res.data
					res.data.gg_content_text.forEach(item => {
						item.content.forEach(ite => {
							this.$set(ite, "num", 0)
						})
					})
					this.gg_content_text = res.data.gg_content_text
				})
			},
			submit() {
				for (let i = 0; i < this.gg_content_text.length; i++) {
					let item = this.gg_content_text[i]
					let num = 0
					item.content.forEach(value => {
						if (value.num != -0) {
							num = num + Number(value.num)
						}
					})
					if (item.fh == 1) { //等於
						if (num != item.num) {
							this.http.toast(item.name + "的規格必選" + item.num + "個")
							return false
						}
					}
					if (item.fh == 2) { //大於等於
						if (num < item.num) {
							this.http.toast(item.name + "的規格至少選擇" + item.num + "個")
							return false
						}
					}
				}
				let data = {
					shoptable_id: this.listid,
					start_date: this.start_date,
					end_date: this.zs_type == 2 ? this.returnxxjsTime(this.end_date, this.dataAll.xxtime) : this
						.end_date,
					zs_type: this.zs_type,
					gg_content: this.gg_content_text,
					is_yc: this.is_yc,
					adult_num: this.adult_num,
					old_num: this.old_num,
					child_num: this.child_num,
					shop_id: this.shop_id,
					gg_price: this.allggmoney(),
					allnum: this.allnum,
					house_num:this.house_num
				}
				if (this.zs_type == 1) {
					data.start_date = data.start_date + ":00"
					data.end_date = this.timereturn(Number(new Date(this.end_date)) + this.dataAll.xxtime * 60 * 60 * 1000)
				}
				httpRequest.request('/api/hotel/create_order', 'POST', data).then(res => {
					httpRequest.toast(res.msg)
					if (res.code == 1) {
						setTimeout(()=>{
							uni.navigateBack(1)
						},1000)
					} else {
						httpRequest.toast(res.msg)
					}

				})
			},
			timereturn(time3) {
				//将时间戳格式转换成年月日时分秒
				var date = new Date(time3);
				var Y = date.getFullYear() + '-';
				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
				var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';

				var h = (date.getHours() < 10 ? '0' + (date.getHours()) : date.getHours()) + ':';
				var m = (date.getMinutes() < 10 ? '0' + (date.getMinutes()) : date.getMinutes()) + ":";
				var s = (date.getSeconds() < 10 ? '0' + (date.getSeconds()) : date.getSeconds());
				var strDate = Y + M + D + h + m + s;
				return strDate
			},
		}
	}
</script>

<style>
	.itemtime {
		padding: 10rpx 20rpx;
		box-sizing: border-box;
		border-radius: 50px;
		position: relative;
		background-color: #ff0000;
		color: #fff;
		font-size: 24rpx
	}

	.posibottom {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		box-sizing: border-box;
	}

	.buybtn {
		border-radius: 15rpx;
		background-color: #f8d43e;
		padding: 15rpx 30rpx;
		color: #333;
		font-size: 32rpx;
	}

	.listleftimg2 {
		width: 110rpx;
		height: 110rpx;
	}
</style>